<!-- 司机信息完善 -->
<template>
  <view class="register-box">
    <view class="colorFA6400"
      >系统提示：身份证拍照后可自动补全身份信息，请仔细核对</view
    >
    <u-form :model="form" ref="uForm" :label-width="290">
      <view class="card-box">
        <view class="u-flex"
          >身份信息
          <view class="card-icon-box">
            <view></view>
            <view></view>
          </view>
        </view>
        <div class="u-flex top-box">
          <u-form-item
            class="width-50"
            label-position="top"
            label="身份证正面"
            left-icon="star-fill"
            :left-icon-style="{
              color: 'red',
              fontsize: '18rpx',
            }"
          >
            <u-upload
              :deletable="
                (userInfo.driverInfo &&
                  userInfo.driverInfo.driverAuditStatus == '2' &&
                  toExamineIndexOf('身份证正面')) ||
                !userInfo.driverInfo
                  ? true
                  : false
              "
              :width="310"
              :height="190"
              class="uUpload1-box"
              ref="uUpload1"
              :action="uploadUrl1"
              @on-success="idcardFrontPhotosuccess"
              @on-remove="idcardFrontPhotoremove"
              @on-error="testerror"
              :show-progress="form.idcardFrontPhoto ? false : true"
              :upload-text="'选择身份证正面'"
              max-count="1"
              :form-data="uploaderData1"
            ></u-upload>
            <image
              v-if="idcardEditable"
              :src="uploadIconList[0].icon"
              style="
                width: 40rpx;
                height: 40rpx;
                display: inline;
                position: absolute;
                bottom: 30rpx;
                right: 10rpx;
              "
            />
            <div
              v-if="
                idcardFrontPhotoremoveFlag &&
                form.idcardFrontPhoto &&
                userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus != '0'
              "
              class="toexamine-box"
            >
              <div v-if="!toExamineIndexOf('身份证正面')">
                <image
                  :src="uploadIconList[1].icon"
                  style="
                    width: 120rpx;
                    height: 120rpx;
                    display: inline;
                    position: absolute;
                    bottom: 70rpx;
                    left: 0;
                  "
                />
              </div>
              <div v-else>
                <image
                  :src="uploadIconList[2].icon"
                  style="
                    width: 120rpx;
                    height: 120rpx;
                    display: inline;
                    position: absolute;
                    bottom: 70rpx;
                    left: 0;
                  "
                />
              </div>
            </div>
          </u-form-item>
          <u-form-item
            class="width-50"
            label-position="top"
            label="身份证反面"
            left-icon="star-fill"
            :left-icon-style="{
              color: 'red',
              fontsize: '18rpx',
            }"
          >
            <u-upload
              :deletable="
                (userInfo.driverInfo &&
                  userInfo.driverInfo.driverAuditStatus == '2' &&
                  toExamineIndexOf('身份证反面')) ||
                !userInfo.driverInfo
                  ? true
                  : false
              "
              :width="310"
              :height="190"
              class="uUpload2-box"
              ref="uUpload2"
              :action="uploadUrl1"
              @on-success="idcardBackPhotosuccess"
              @on-remove="idcardBackPhotoremove"
              @on-error="testerror"
              :show-progress="form.idcardBackPhoto ? false : true"
              :upload-text="'选择身份证反面'"
              max-count="1"
              :form-data="uploaderData2"
            ></u-upload>
            <image
              v-if="idcardBackEditable"
              :src="uploadIconList[0].icon"
              style="
                width: 40rpx;
                height: 40rpx;
                display: inline;
                position: absolute;
                bottom: 30rpx;
                right: 10rpx;
              "
            />
            <div
              v-if="
                idcardBackPhotoremoveFlag &&
                form.idcardBackPhoto &&
                userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus != '0'
              "
              class="toexamine-box"
            >
              <div v-if="!toExamineIndexOf('身份证反面')">
                <image
                  :src="uploadIconList[1].icon"
                  style="
                    width: 120rpx;
                    height: 120rpx;
                    display: inline;
                    position: absolute;
                    bottom: 70rpx;
                    left: 0;
                  "
                />
              </div>
              <div v-else>
                <image
                  :src="uploadIconList[2].icon"
                  style="
                    width: 120rpx;
                    height: 120rpx;
                    display: inline;
                    position: absolute;
                    bottom: 70rpx;
                    left: 0;
                  "
                />
              </div>
            </div>
          </u-form-item>
        </div>

        <u-form-item
          label="司机姓名"
          left-icon="star-fill"
          :left-icon-style="{
            color: 'red',
            fontsize: '18rpx',
          }"
        >
          <u-input
            :disabled="
              (userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus == '1') ||
              (userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus == '0') ||
              !idcardEditable
            "
            v-model="form.driverName"
            placeholder="请输入司机姓名"
          />
        </u-form-item>
        <u-form-item
          ref="idcard"
          prop="idcard"
          label="身份证号"
          left-icon="star-fill"
          :left-icon-style="{
            color: 'red',
            fontsize: '18rpx',
          }"
        >
          <u-input
            :disabled="
              (userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus == '1') ||
              (userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus == '0') ||
              !idcardEditable
            "
            v-model="form.idcard"
            :maxlength="18"
            placeholder="请填写身份证号"
            @on-blur="upperCase"
          />
        </u-form-item>
      </view>
      <view class="card-box">
        <view class="u-flex"
          >驾驶信息<view class="card-icon-box">
            <view></view>
            <view></view> </view
        ></view>
        <u-form-item
          class="width-100"
          label="驾驶证"
          prop="driverLicense"
          left-icon="star-fill"
          :left-icon-style="{
            color: 'red',
            fontsize: '18rpx',
          }"
        >
          <u-upload
            :deletable="
              (userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus == '2' &&
                toExamineIndexOf('驾驶证')) ||
              !userInfo.driverInfo
                ? true
                : false
            "
            class="uUpload3-box"
            ref="uUpload3"
            :action="uploadUrl"
            @on-success="driverLicensesuccess"
            @on-remove="driverLicenseremove"
            @on-error="testerror"
            :show-progress="form.driverLicense ? false : true"
            max-count="1"
            :form-data="uploaderData"
          ></u-upload>
          <image
            v-if="driverLicenseEditable"
            :src="uploadIconList[0].icon"
            style="
              width: 40rpx;
              height: 40rpx;
              display: inline;
              position: absolute;
              bottom: 30rpx;
              right: 160rpx;
            "
          />
          <div
            v-if="
              driverLicenseremoveFlag &&
              form.driverLicense &&
              userInfo.driverInfo &&
              userInfo.driverInfo.driverAuditStatus != '0'
            "
            class="toexamine-box"
          >
            <div v-if="!toExamineIndexOf('驾驶证')">
              <image
                :src="uploadIconList[1].icon"
                style="
                  width: 120rpx;
                  height: 120rpx;
                  display: inline;
                  position: absolute;
                  bottom: 82rpx;
                  left: -10rpx;
                "
              />
            </div>
            <div v-else>
              <image
                :src="uploadIconList[2].icon"
                style="
                  width: 120rpx;
                  height: 120rpx;
                  display: inline;
                  position: absolute;
                  bottom: 82rpx;
                  left: -10rpx;
                "
              />
            </div>
          </div>
        </u-form-item>
      </view>
      <view class="card-box">
        <view class="u-flex"
          >从业资格证<view class="card-icon-box">
            <view></view>
            <view></view> </view
        ></view>
        <u-form-item
          class="width-100"
          label="从业资格证"
          prop="certificateNo"
          left-icon="star-fill"
          :left-icon-style="{
            color: 'red',
            fontsize: '18rpx',
          }"
        >
          <u-upload
            :deletable="
              (userInfo.driverInfo &&
                userInfo.driverInfo.driverAuditStatus == '2' &&
                toExamineIndexOf('从业资格证')) ||
              !userInfo.driverInfo
                ? true
                : false
            "
            ref="uUpload4"
            :action="uploadUrl2"
            @on-success="certificateNosuccess"
            @on-remove="certificateNoremove"
            @on-error="testerror"
            :show-progress="form.certificateNo ? false : true"
            max-count="1"
            :form-data="certificateNouploaderData"
          ></u-upload>
          <image
            v-if="certificateNoEditable"
            :src="uploadIconList[0].icon"
            style="
              width: 40rpx;
              height: 40rpx;
              display: inline;
              position: absolute;
              bottom: 30rpx;
              right: 160rpx;
            "
          />
          <div
            v-if="
              certificateNoremoveFlag &&
              form.certificateNo &&
              userInfo.driverInfo &&
              userInfo.driverInfo.driverAuditStatus != '0'
            "
            class="toexamine-box"
          >
            <div v-if="!toExamineIndexOf('从业资格证')">
              <image
                :src="uploadIconList[1].icon"
                style="
                  width: 120rpx;
                  height: 120rpx;
                  display: inline;
                  position: absolute;
                  bottom: 82rpx;
                  left: -10rpx;
                "
              />
            </div>
            <div v-else>
              <image
                :src="uploadIconList[2].icon"
                style="
                  width: 120rpx;
                  height: 120rpx;
                  display: inline;
                  position: absolute;
                  bottom: 82rpx;
                  left: -10rpx;
                "
              />
            </div>
          </div>
        </u-form-item>
      </view>
    </u-form>
    <u-button
      type="primary"
      @click="submit"
      v-if="
        (userInfo.driverInfo && userInfo.driverInfo.driverAuditStatus == '2') ||
        !userInfo.driverInfo
      "
      class="vehiclemanagement-index-btn"
      >提交
    </u-button>
  </view>
</template>
<script>
import httpEnum from './../../common/httpEnum.js'
export default {
  data() {
    return {
      idcardEditable: false,
      idcardBackEditable: false,
      certificateNoEditable: false,
      driverLicenseEditable: false,
      userInfo: {},
      getCodeDisabled: false,
      show: true,
      count: '',
      timer: null,
      uploadUrl:
        httpEnum.baseUploadUrl +
        '/freight-business/ocr/recognize/drivingLicense',
      uploaderData: {
        bucketName: 'app',
        folderName: 'drivingLicense',
      },
      uploadUrl1:
        httpEnum.baseUploadUrl + '/freight-business/ocr/recognize/idcard',
      uploadUrl2: httpEnum.baseUploadUrl + '/freight-business/file/app/upload',
      uploaderData1: {
        bucketName: 'logistics-control-platform',
        folderName: 'driverManagement',
        type: 'face',
      },
      uploaderData2: {
        bucketName: 'logistics-control-platform',
        folderName: 'driverManagement',
        type: 'back',
      },
      certificateNouploaderData: {
        bucketName: 'app',
        folderName: 'photo',
      },
      fleetNameShow: false,
      fleetNamelist: [],
      form: {
        driverName: undefined, //司机姓名
        // phone: undefined, //手机号
        idcard: undefined, //身份证号
        // verificationCode: undefined, //验证码
        driverLicense: undefined, //驾驶证
        idcardFrontPhoto: undefined, //身份证正面
        idcardBackPhoto: undefined, //身份证反面
        certificateNo: undefined, //从业资格证
      },
      rules: {
        // driverName: [
        //   {
        //     required: true,
        //     message: '请填写司机姓名',
        //     trigger: ['change', 'blur'],
        //   },
        // ],
        phone: [
          {
            required: true,
            message: '请填写手机号',
            trigger: ['change', 'blur'],
          },
          {
            // 自定义验证函数，见上说明
            validator: (rule, value, callback) => {
              // 上面有说，返回true表示校验通过，返回false表示不通过
              // this.$u.test.mobile()就是返回true或者false的
              return this.$u.test.mobile(value)
            },
            message: '手机号码不正确',
            // 触发器可以同时用blur和change
            trigger: ['change', 'blur'],
          },
        ],
        verificationCode: [
          {
            required: true,
            message: '请输入验证码',
            trigger: ['change', 'blur'],
          },
        ],
        idcard: [
          {
            required: true,
            message: '身份证号码不能为空',
            trigger: 'blur',
          },
          {
            type: 'string',
            pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
            message: '请输入正确的身份证号',
            trigger: ['change', 'blur'],
          },
        ],
      },
      maxSize: 1024 * 1024 * 4,
      deletableTextList: [], //数组
      ids: undefined,
      idcardFrontPhotoremoveFlag: true, //身份证正面删除标识
      idcardBackPhotoremoveFlag: true, //身份证反面删除标识
      driverLicenseremoveFlag: true, //驾驶证删除标识
      certificateNoremoveFlag: true, //从业资格证删除标识
      uploadIconList: [
        {
          icon: 'https://minio.wskjwl.com/uipicture/correcticon.png',
          path: '/pages/vehiclemanagement/vehiclemanagement',
          title: '完成标识',
        },
        {
          icon: 'https://minio.wskjwl.com/uipicture/uploadpass.png',
          path: '/pages/login/register',
          title: '审核通过',
        },
        {
          icon: 'https://minio.wskjwl.com/uipicture/uploadreject.png',
          path: '/pages/login/register',
          title: '审核失败',
        },
      ],
    }
  },
  mounted() {
    this.getDertailData()
    this.getuserInfo1()
    // this.getFleetNameData()
  },
  // 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
  onReady() {
    this.$refs.uForm.setRules(this.rules)
  },
  onShow() {
    // this.getDertailData()
  },
  watch: {
    'form.idcard'(val, old) {
      this.upperCase(val)
    },
  },
  methods: {
    //触发校验
    triggerSingleFieldValidate(refName) {
      this.$refs[refName].onFieldChange()
    },
    //审核存在判断
    toExamineIndexOf(val) {
      let tagFlag = undefined
      if (this.deletableTextList.indexOf(val) == -1) {
        tagFlag = false
      } else {
        tagFlag = true
      }
      return tagFlag
    },
    //字符串中小写转大写
    upperCase(str) {
      let arr = str.split('')
      let newStr = ''
      // 通过数组的forEach方法来遍历数组
      arr.forEach(function (value) {
        if (value >= 'a' && value <= 'z') newStr += value.toUpperCase()
        else newStr += value
      })
      this.form.idcard = newStr
    },
    //获取验证码
    getCode() {
      if (this.form.phone) {
        const intime = 60
        if (!this.timer) {
          this.count = intime
          this.show = false
          this.getCodeDisabled = true
          this.timer = setInterval(() => {
            if (this.count > 0 && this.count <= intime) {
              this.count--
            } else {
              this.show = true
              this.getCodeDisabled = false
              clearInterval(this.timer)
              this.timer = null
            }
          }, 1000)
          this.getCodeData({
            type: '1',
            iphone: this.form.phone,
          })
        }
      } else {
        this.$api.msg('请先输入手机号码')
      }
    },
    // 发送短信验证码
    async getCodeData(val) {
      const { code, result, message } = await this.$u.post(
        '/freight-auth/client/smsSend',
        val
      )
      if (code === '0') {
        this.$api.msg('短信验证已发送')
      } else {
        this.$api.msg(message)
      }
    },
    //车型选择
    fleetNameconfirm(val) {
      this.form.fleetName = val[0].label
      this.form.fleetId = val[0].value
    },
    //驾驶证
    driverLicensesuccess(data, index, lists, name) {
      if (data.code == '0') {
        this.form.driverLicense = data.result.imgUrl
        this.driverLicenseEditable = true
      } else {
        setTimeout(() => {
          this.$api.msg(data.message)
        }, 200)
        this.$refs.uUpload3.lists = []
      }
    },
    //驾驶证移除
    driverLicenseremove() {
      this.form.driverLicense = undefined
      this.driverLicenseremoveFlag = false
      this.driverLicenseEditable = false
    },
    //身份证正面
    idcardFrontPhotosuccess(data, index, lists, name) {
      if (data.code == '0') {
        this.form.driverName = data.result.name
        this.form.idcard = data.result.idNumber
        this.form.idcardFrontPhoto = data.result.imgUrl
        this.triggerSingleFieldValidate('idcard')
        this.idcardEditable = true
      } else {
        setTimeout(() => {
          this.$api.msg(data.message)
        }, 200)
        this.$refs.uUpload1.lists = []
      }
    },
    //身份证正面移除
    idcardFrontPhotoremove() {
      this.form.idcardFrontPhoto = undefined
      this.idcardFrontPhotoremoveFlag = false
      this.idcardEditable = false
    },
    //身份证反面
    idcardBackPhotosuccess(data, index, lists, name) {
      if (data.code == '0') {
        this.form.idcardBackPhoto = data.result.imgUrl
        this.idcardBackEditable = true
      } else {
        setTimeout(() => {
          this.$api.msg(data.message)
        }, 200)
        this.$refs.uUpload2.lists = []
      }
    },
    //身份证反面移除
    idcardBackPhotoremove() {
      this.form.idcardBackPhoto = undefined
      this.idcardBackPhotoremoveFlag = false
      this.idcardBackEditable = false
    },
    //上传失败
    testerror(res, index, lists, name) {
      this.$api.msg('上传失败')
    },
    //从业资格证上传成功
    certificateNosuccess(data, index, lists, name) {
      if (data.code == '0') {
        this.form.certificateNo = data.result
        this.certificateNoEditable = true
      } else {
        this.form.certificateNo = ''
        setTimeout(() => {
          this.$api.msg(data.message)
        }, 200)
      }
    },
    //从业资格证移除
    certificateNoremove() {
      this.form.certificateNo = undefined
      this.certificateNoremoveFlag = false
      this.certificateNoEditable = false
    },
    //提交
    submit() {
      this.$refs.uForm.validate((valid) => {
        if (valid) {
          if (this.form.driverName && this.form.idcard) {
            this.postData(this.form)
          } else {
            this.$api.msg('请填写相关信息')
          }
        } else {
          this.$api.msg('请填写相关信息')
        }
      })
    },
    // 提交数据
    postData(data) {
      let photoList = [
        'driverLicense',
        'idcardFrontPhoto',
        'idcardBackPhoto',
        'certificateNo',
      ]
      let tagShow = true
      photoList.forEach((item) => {
        if (!data[item] || data[item] == undefined) {
          tagShow = false
        }
      })
      let obj = {
        ...data,
      }
      if (tagShow) {
        this.getuserInfo(obj)
      } else {
        this.$api.msg('部分图片未上传或上传图片有误')
      }
    },
    // 注册提交
    async submitData(val) {
      const { code, result, message } = await this.$u.post(
        '/freight-business/driver/register',
        val
      )
      if (code === '0') {
        this.$api.msg('信息完善成功')
        setTimeout(() => {
          uni.switchTab({
            url: '/pages/tabbar/my/my',
          })
        }, 2000)
      } else {
        this.$api.msg(message)
      }
    },
    // 重置审核弹窗状态
    async editNoticeFlag(val) {
      const { code, result, message } = await this.$u.post(
        '/freight-auth/userAccount/editNoticeFlag',
        val
      )
      if (code === '0') {
      } else {
        this.$api.msg(message)
      }
    },
    // 注册提交
    async submitEditData(val) {
      const { code, result, message } = await this.$u.post(
        '/freight-business/driver/edit',
        val
      )
      if (code === '0') {
        this.editNoticeFlag({
          id: this.ids,
          noticeFlag: 0,
        })
        this.$api.msg('信息完善成功')
        setTimeout(() => {
          uni.switchTab({
            url: '/pages/tabbar/my/my',
          })
        }, 2000)
      } else {
        this.$api.msg(message)
      }
    },
    // 请求所属车队数据
    async getFleetNameData() {
      const { code, result, message } = await this.$u.get(
        '/freight-business/logisticsFleet/getList'
      )
      if (code === '0') {
        result.forEach((item) => {
          this.fleetNamelist.push({
            label: item.fleetName,
            value: item.id,
          })
        })
      } else {
        this.$api.msg(message)
      }
    },
    async getuserInfo1() {
      const res = await this.$u.get('/freight-business/get/driverInfo')
      if (res.code === '0') {
        this.userInfo = res.result
        // this.deletableTextList = [
        //   ...res.result.driverInfo.driverRejectInfo,
        //   ...res.result.carInfo.carRejectInfo,
        // ]
        let driverRejectInfoList =
          res.result.driverInfo != {} &&
          res.result.driverInfo?.driverRejectInfo &&
          res.result.driverInfo.driverRejectInfo.length
            ? res.result.driverInfo.driverRejectInfo
            : []
        let carRejectInfoList =
          res.result.carInfo != {} &&
          res.result.carInfo?.carRejectInfo &&
          res.result.carInfo.carRejectInfo.length
            ? res.result.carInfo.carRejectInfo
            : []
        this.deletableTextList = [...driverRejectInfoList, ...carRejectInfoList]
        console.log('this.deletableTextList', this.deletableTextList)
        this.ids = res.result.id
      } else {
        this.$api.msg(res.message)
      }
    },
    async getuserInfo(val) {
      const res = await this.$u.get('/freight-business/get/driverInfo')
      if (res.code === '0') {
        if (res.result.driverInfo) {
          this.submitEditData({
            ...val,
            driverId: res.result.driverInfo.driverId,
          })
        } else {
          this.submitData({ ...val, referrerId: res.result.referrerId })
        }
      } else {
        this.$api.msg(res.message)
      }
    },
    // 请求详情数据
    async getDertailData() {
      const { code, result, message } = await this.$u.get(
        '/freight-business/driver/findByAccoutId?id=' +
          uni.getStorageSync('userInfo').additionalInformation.userId
      )
      if (code === '0') {
        if (result) {
          this.form.driverName = result.driverName
          this.form.idcard = result.idcard
          this.form.driverLicense = result.driverLicense
          this.form.idcardFrontPhoto = result.idcardFrontPhoto
          this.form.idcardBackPhoto = result.idcardBackPhoto
          this.form.certificateNo = result.certificateNo
          this.$refs.uUpload4.lists = [
            {
              url: httpEnum.baseImgUrl + '/app/' + result.certificateNo,
            },
          ]
          this.$refs.uUpload3.lists = [
            {
              url: httpEnum.baseImgUrl + '/app/' + result.driverLicense,
            },
          ]
          this.$refs.uUpload1.lists = [
            {
              url:
                httpEnum.baseImgUrl +
                '/freight-control-platform/' +
                result.idcardFrontPhoto,
            },
          ]
          this.$refs.uUpload2.lists = [
            {
              url:
                httpEnum.baseImgUrl +
                '/freight-control-platform/' +
                result.idcardBackPhoto,
            },
          ]
        }
      } else {
        this.$api.msg(message)
      }
    },
  },
}
</script>
<style lang="scss" scoped>
.register-box {
  background-color: rgb(238, 238, 239);
  padding: 8rpx 24rpx 16rpx;
  .colorFA6400 {
    color: #fa6400;
    font-size: 24rpx;
  }
  .top-box {
    .width-50 {
      flex: 1;
      position: relative;
      .toexamine-box {
        position: absolute;
        bottom: 30rpx;
        left: 10rpx;
        color: white;
        width: 50rpx;
        height: 50rpx;
        border-radius: 50%;
        font-size: 18rpx;
        display: flex;
        flex-direction: column;
        align-items: center;
        line-height: 22rpx;
      }
    }
  }

  .width-100 {
    position: relative;
    .toexamine-box {
      position: absolute;
      bottom: 30rpx;
      right: 300rpx;
      color: white;
      width: 50rpx;
      height: 50rpx;
      border-radius: 50%;
      font-size: 18rpx;
      display: flex;
      flex-direction: column;
      align-items: center;
      line-height: 22rpx;
    }
  }
  .row-box {
    display: flex;
    margin-right: 16rpx;
  }
  .getCode-box {
    width: 100rpx;
  }
  .card-box {
    background: white;
    margin-top: 24rpx;
    border-radius: 10rpx;
    padding: 24rpx 24rpx 0;
    .card-title-box {
      font-size: 28rpx;
      font-weight: 600;
    }
    .card-icon-box {
      margin-left: 6rpx;
      position: relative;
      view:nth-child(1) {
        width: 20rpx;
        height: 20rpx;
        border-radius: 50%;
        background: #57a3ff;
        position: absolute;
        top: -12rpx;
        left: 10rpx;
        z-index: 1;
      }
      view:nth-child(2) {
        width: 20rpx;
        height: 20rpx;
        border-radius: 50%;
        background: #add3ff;
        position: absolute;
        top: -6rpx;
        left: 20rpx;
      }
    }
  }
  .uUpload1-box {
    /deep/.u-list-item {
      background-image: url('https://minio.wskjwl.com/uipicture/shenfenzhengzheng.png');
      background-size: 100% 100%;
      background-position: center;
      background-repeat: no-repeat;
    }
  }
  .uUpload2-box {
    /deep/.u-list-item {
      background-image: url('https://minio.wskjwl.com/uipicture/shenfenzheng2.png');
      background-size: 100% 100%;
      background-position: center;
      background-repeat: no-repeat;
    }
  }
  .uUpload3-box {
    /deep/.u-list-item {
      background-image: url('https://minio.wskjwl.com/uipicture/jiashizheng.png');
      background-size: 100% 100%;
      background-position: center;
      background-repeat: no-repeat;
      .u-add-tips {
        display: none;
      }
    }
  }
}
</style>
